* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

body {
  background-color: #323846; }

.content .header {
  height: 80px;
  line-height: 80px;
  background-color: #282d38;
  color: #8c96a8;
  font-size: 30px;
  text-align: center;
  position: relative; }
  .content .header .aboutLogin, .content .header .logout {
    position: absolute;
    right: 20px;
    top: 0;
    height: 100%;
    font-size: 14px; }
    .content .header .aboutLogin a, .content .header .logout a {
      color: inherit; }

.content .main {
  color: #8c96a8;
  padding: 20px 40px; }
  .content .main .item {
    border-bottom: 1px dotted #8c96a8;
    padding: 20px 0;
    overflow: hidden; }
  .content .main .message {
    font-size: 18px;
    line-height: 30px;
    margin-bottom: 10px;
    text-align: justify; }
  .content .main .username, .content .main .time {
    font-size: 14px; }
  .content .main .username {
    float: left; }
  .content .main .time {
    float: right; }
  .content .main .nologin {
    margin-top: 50px; }
  .content .main .reply {
    margin-top: 50px; }
    .content .main .reply textarea {
      background-color: transparent;
      border: 1px solid #8c96a8;
      border-radius: 10px;
      width: 100%;
      color: #8c96a8;
      padding: 20px;
      font-size: 16px; }
    .content .main .reply button {
      padding: 5px 15px;
      border: none;
      border-radius: 4px;
      background-color: #19b6d6;
      color: #fff; }
